<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>校园交流平台</title>
    <link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon" />
    <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
    <!-- 引入vuejs -->
    <script src="https://cdn.jsdelivr.net/npm/vue"></script>
    <!-- 引入element样式 -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <!-- 引入element组件库 -->
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
    <!--模板通用css-->
    <link rel="stylesheet" href="css/common.css">
</head>
<body>
    <el-container id="app" v-cloak>
            <div th:replace="fragment/common::header"></div>
            <div class="pad"></div>
            <el-card class="carddiv">
                <el-breadcrumb separator-class="el-icon-arrow-right">
	                <el-breadcrumb-item><a href="forum">校园论坛</a></el-breadcrumb-item>
	                <el-breadcrumb-item><a href="themelist">主题列表</a></el-breadcrumb-item>
	                <el-breadcrumb-item>主贴列表</el-breadcrumb-item>
	            </el-breadcrumb>
                <el-row style="margin-top:30px;"> 
                    <el-col :span="4" :offset="1">
                        <el-input v-model="filter.title" placeholder="主贴标题" prefix-icon="el-icon-search" clearable></el-input>
                    </el-col>
                    <el-col :span="4" :offset="1">
                        <el-date-picker v-model="filter.createtime" type="date" placeholder="创建日期"></el-date-picker>
                    </el-col>
                    <el-col :span="4" :offset="1" style="text-align:right;">
                        <el-button @click="search" type="primary" icon="el-icon-search">搜索</el-button>
                    </el-col>
                    <el-col :span="2" :offset="1" style="text-align:left;">
                        <el-button @click="reset" type="primary" icon="el-icon-refresh">重置</el-button>
                    </el-col>
                    <el-col :span="2" :offset="1">
                        <el-button type="success" plain icon="el-icon-edit-outline" @click="addmain" round>新增</el-button>
                    </el-col>
                    
                </el-row>
                <el-divider></el-divider>
                <el-table :data="mains" style="width: 100%" stripe>
                    <el-table-column type="index" label="序号" width="100"></el-table-column>
                    <el-table-column prop="title" label="主贴标题" ></el-table-column>
                    <el-table-column prop="createuser" label="创建人" width="180"></el-table-column>
                    <el-table-column prop="createtime" label="发布日期" width="180"></el-table-column>
                    <el-table-column label="操作" width="220">
                        <template slot-scope="scope">
                            <el-button
                                type="primary"
                                size="mini"
                                @click="handleSee(scope.$index, scope.row)">查看详情</el-button>
                            <el-button v-if="admin||scope.row.createuser==userName"
                                size="mini"
                                type="danger"
                                @click="handleDelete(scope.$index, scope.row)">删除</el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </el-card>

        
    </el-container>
    <script th:inline="javascript">
        new Vue({
            el:'#app',
            data(){
                return{
                	activeIndex: '',
                    userName:'张三 ',
                    admin:false,
                    filter:{
                        createtime:null,
                        title:''
                    },
                    mains:[],
                    themeId:''
                }
            },
            created:function(){
            	this.userName=[[${session.userName}]];
            	this.admin=[[${session.admin}]];
            	this.themeId=[[${themeId}]];
            	//获取数据
            	this.getData();
            },
            methods:{
            	//选择nav选项
            	handleSelect(key, keyPath){
                    switch(key){
                    case '1':
                    	window.location.href="index";
                    	break;
                    case '2':
                    	window.location.href="forum";
                        break;
                    case '3':
                    	window.location.href="blog";
                        break;
                    case '4-1':
                        window.location.href="http://www.dl-city.com/";
                        break;
                    case '4-2':
                        window.location.href="http://citytsg.dlut.edu.cn/index.htm";
                        break;
                    case '4-3':
                        window.location.href="http://cityftp.dlut.edu.cn/index.htm";
                        break;
                    case '4-4':
                        window.location.href="http://172.30.2.66/vod/action/indexListAction.do?method=indexShow";
                        break;
                    case '4-5':
                        window.location.href="http://tv.byr.cn/show";
                        break;
                    }
                },
                getData(){
                	var _this=this;
                	var pct;
                	var ct=_this.filter.createtime;
                	if(ct==null){
                		pct=0;
                	}else{
                		pct=ct.getTime();
                	}
                	$.ajax({
                		url:'mainlistdata',
                		type:'GET',
                		data:{
                			pTitle:_this.filter.title,
                			pCT:pct,
                			themeId:_this.themeId
                		},
                		dataType:'json',
                		success:function(data){
                			_this.mains=data;
                		}
                	});
                },
                //搜索
                search(){
                	this.getData();
                },
                //重置
                reset(){
                	this.filter={
                            createtime:null,
                            title:''
                        };
                	this.getData();
                },
                handleSee(index, row){
                	var id=row.id;
                	window.location.href='postsinfo?id='+id;
                },
                handleDelete(index, row){
                	var _this=this;
                	var id=row.id;
                	_this.$confirm('此操作将永久删除该主贴, 是否继续?', '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                      }).then(() => {
                    	  $.ajax({
                              url:'deletemain',
                              type:'get',
                              data:{
                                  id:id
                              },
                              dataType:'json',
                              success:function(data){
                                  _this.getData();
                                  _this.$message.success("删除成功");
                              }
                          });
                          });
                	
                },
                addmain(){
                	window.location.href='toaddmain?themeId='+this.themeId;
                }
                
                
                
                
            }
        })
    </script>
    <style>
        .carddiv{
            width: 80%;
            margin: 0 auto;
        }
    </style>
</body>
</html>